<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	<style>
		body{
			height: 1000000px;
			background-image: url(img/狗.png);
			background-size: contain;
			/* 函数 cover 等比例放大图片 特点：原图按照比例大放大存背景空间
			    【开发者：背景图大小是否等于背景空间】
			    contain 等比例缩放图片  特点：图片按照比例缩放存背景空间
				【开发者：背景图等比例显示在背景空间】
			 */
			/* 背景附件--尺寸中存在cover或者contain */
			background-attachment:fixed;/*fixed固定    scroll背景图跟内容动  */
		}
		div{
			width: 300px;
			height: 300px;
			background-color: #e4393c;
			background: #fffa5e;
			background-image: url(img/狗.png);
			/* 问题：超大图-不显示  小图-显示
			 注意：背景空间大小，如果图小于背景空间---平铺
			 */
			background-repeat: no-repeat;
			/* no-repeat不平铺 rppeat-x，y 横，纵向平铺 */
			background-size: 30%;
			/* 背景尺寸属性图：数值px %|函数 cover contain */
			/* 背景定位：前提背景空间大于背景图  关键字  center、left、right、top... */
			background-position: 80% 0;
		}
	</style>
	</head>
	<body>
		Lorem, ipsum dolor sit amet consectetur adipisicing elit. Unde dolore rem quo neque reiciendis eius quae, recusandae consequatur cupiditate nihil accusantium cumque omnis officiis ipsum illum ab laboriosam sint non?
		Lorem ipsum dolor, sit amet consectetur adipisicing elit. Nesciunt reiciendis vitae ipsam ab, sint esse impedit beatae fugiat minus neque et a provident similique vel facere, labore laboriosam cumque doloremque?
		Lorem ipsum dolor, sit amet consectetur adipisicing elit. Possimus quia id molestiae quod, blanditiis perferendis saepe voluptas quis optio, itaque, odit illo. Veniam, error aspernatur culpa ullam eaque inventore iusto.
		<!--html img图片  引入一张图片，位置不可随意改变
		   css 背景 图片  引入一张图片，位置可以随意改变
		   子属性 background-color 背景颜色
		          background-image 背景图
				  background-repeat背景重复
				  background-size背景尺寸
				  background-attachment背景附件
				  background-position背景定位
		   复合属性 background：background-image  background-color  
		   background-position  background-size  background-repeat和background-attachment
		   
		   简写属性background：background-image  background-position| background-size 
		   替代属性： background-image、background-color、background-repeat
		   -->
		   <div></div>
	</body>
</html>